<template>
	<div>
		<a-modal v-model:visible="open" width="1000px" title="社团成员信息列表" @ok="handleOk" @close="handleOk">
			<a-table bordered :data-source="loadData" :columns="columns"></a-table>
		</a-modal>
	</div>
</template>
<script setup name="bizGroupUserList">
	import { defineComponent, ref } from 'vue'
	import bizGroupApi from '@/api/biz/bizGroupApi'
	// 模态框状态
	const open = ref(false)

	const toolConfig = { refresh: true, height: true, columnSetting: true, striped: false }

	const showModal = async (record, groupId) => {
		open.value = true
		let param = {
			groupId: groupId
		}
		let data = await bizGroupApi.getbizGroupUserList(param)
		console.log(data)
		loadData.value = data
	}
	const handleOk = (e) => {
		loadData.value = []
		open.value = false
	}
	const columns = [
		{
			title: '用户姓名',
			dataIndex: 'userName',
			align: 'center'
		},
		{
			title: '联系方式',
			dataIndex: 'userPhone',
			align: 'center'
		},
		{
			title: '所属单位',
			dataIndex: 'orgName',
			align: 'center'
		}
	]
	// 请求社团成员数据
	const loadData = ref([])
	// 列表选择配置
	const options = {
		// columns数字类型字段加入 needTotal: true 可以勾选自动算账
		alert: {
			show: true,
			clear: () => {
				selectedRowKeys.value = ref([])
			}
		},
		rowSelection: {
			onChange: (selectedRowKey, selectedRows) => {
				selectedRowKeys.value = selectedRowKey
			}
		}
	}

	// 抛出函数
	defineExpose({
		showModal
	})
</script>
